<template>
  <div class="yanshou">
    <el-dialog
      title="验收"
      :visible.sync="dialogTableVisible"
      :close-on-click-modal="false"
      :before-close="close"
      width="65%"
      class="dialog"
    >
      <div style="max-width:1000px;margin:auto;">
        <table border="1" rules="all" class="table">
          <tr>
            <td>名称</td>
            <td>{{info.deviceName}}</td>
            <td>规格型号</td>
            <td>{{info.deviceModel}}</td>
          </tr>
          <tr>
            <td>计划数量</td>
            <td>
              {{info.anticipatedProcureNum}}
            </td>
            <td>剩余数量</td>
            <td>
              {{info.remainingQuantity}}
            </td>
          </tr>
          <tr>
            <td>验收数量(<strong style="color:red;">可修改</strong>)</td>
            <td>
              <el-input type="tel" v-model.number="num" @keyup.native="num=oninput(num)" :min="1" :max="this.info.remainingQuantity"></el-input>
            </td>
            <td>单位</td>
            <td>{{info.deviceUnitName}}</td>
          </tr>
          <tr>
            <td>需要程度</td>
            <td>{{info.degreeNeed}}</td>
            <td>用途</td>
            <td>{{info.purpose}}</td>
          </tr>
          <tr>
            <td>使用单位</td>
            <td>{{info.recipientsDeptName}}</td>
            <td>设备分类</td>
            <td>{{info.deviceTypeName}}</td>
          </tr>
          <tr>
            <td>备注</td>
            <td colspan="3">{{info.remark}}</td>
          </tr>
        </table>
        <div style="text-align:center;padding:50px;">
          <el-button size="mini" type="success" :loading="loading" @click="submit">提交</el-button>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import request from "@/utils/request";
export default {
  name: "yanshou",
  props: ["info"],
  data() {
    return {
      loading:false,
      dialogTableVisible: true,
      num: 0,
    };
  },
  created() {
    this.num = this.info.remainingQuantity;
    console.log(this.info);
  },
  methods: {
    close() {
      this.$emit("subSetChane");
    },
    submit() {
      this.loading = true
      request({
        url: `/device/storageRecord/save`,
        method: "post",
        data: {
          procureDeviceId: this.info.id,
          storageNumber: this.num,
          remainingQuantity: this.info.remainingQuantity,
          deviceLevel:this.info.deviceLevel
        },
      }).then((res) => {
        if (res.code == 200) {
          this.$message.success(res.msg);
          this.$emit("subSetChane", 1);
        }
        this.loading = false
      });
    },
    oninput(val){
      if(val<=this.info.remainingQuantity){
        return val
      }else{
        return 1
      }
    }
  },
};
</script>

<style lang="scss">
.yanshou {
  .dialog .el-dialog__body {
    height: 85vh;
    overflow: scroll;
  }
  td:nth-child(2n) {
    padding-left: 15px;
  }
}
</style>
